<template>
  <div class="rules-group-container">
    <div class="rules-group-header">
      <el-radio-group v-model="data.condition" size="mini">
        <el-radio-button label="AND"></el-radio-button>
        <el-radio-button label="OR"></el-radio-button>
      </el-radio-group>
      <div>
        <el-button size="mini" @click="addRule(data)">添加规则</el-button>
        <el-button size="mini" @click="addGroup(data)">添加分组</el-button>
        <el-button v-if="parent" size="mini" @click="delGroup(data, parent)">删除</el-button>
      </div>
    </div>
    <div class="rules-group-body">
      <div class="rules-list">
        <template v-for="(rule, index) in data.rules">
          <div :key="index" v-if="!rule.condition" class="rule-container">
            <!-- 字段 -->
            <wt-dropdown
              class="rule-item"
              v-model="rule.FilterField"
              :data="getFieldList(rule.FilterTable)"
              @change="handleFieldChange(rule)"
            ></wt-dropdown>
            <!-- 操作符 -->
            <wt-dropdown
              class="rule-item"
              v-model="rule.Operator"
              :disabled="inputStatus && rule.FilterField === 'CommunityId'"
              :data="getRule(rule.FilterTable, rule.FilterField)"
            ></wt-dropdown>
            <!-- 值 -->
            <wt-multi-dropdown
              class="rule-item-long"
              v-if="rule.type === 'Dropdown'"
              :disabled="inputStatus && rule.FilterField === 'CommunityId'"
              v-model="rule.FilterValue"
              :data="getData(rule.FilterTable, rule.FilterField)"
            ></wt-multi-dropdown>
            <wt-number
              class="rule-item-long"
              :disabled="inputStatus && rule.FilterField === 'CommunityId'"
              v-else-if="['DateTime', 'Number', 'Decimal'].includes(rule.type)"
              v-model="rule.FilterValue"
            ></wt-number>
            <wt-text class="rule-item-long" v-else v-model="rule.FilterValue" :disabled="inputStatus && rule.FilterField === 'CommunityId'"></wt-text>
            <el-button size="mini" @click="delRule(index)">删除</el-button>
          </div>
          <CreateRule
            :key="index"
            v-else
            :data="rule"
            :parent="data"
            :fieldList="fieldList"
            :operatorList="operatorList"
          ></CreateRule>
        </template>
      </div>
    </div>
  </div>
</template>



<script>
const inputStatus = false
const rules = {
  string: [
    {
      value: '==',
      label: '等于',
    },
    {
      value: '<>',
      label: '不等于',
    },
    {
      value: '?',
      label: '包含',
    },
    {
      value: '?',
      label: '不包含',
    },
    {
      value: 'in',
      label: '其中之一',
    },
    {
      value: 'ni',
      label: '非其中之一',
    },
    {
      value: 'mc',
      label: '多包含',
    },
  ],
  number: [
    {
      value: '==',
      label: '等于',
    },
    {
      value: '<>',
      label: '不等于',
    },
    {
      value: '≥',
      label: '大于等于',
    },
    {
      value: '≤',
      label: '小于等于',
    },
  ],
  dict: [
    {
      value: 'in',
      label: '其中之一',
    },
    {
      value: 'ni',
      label: '非其中之一',
    },
  ],
  date: [
    {
      value: 'sdiff',
      label: '几天前',
    },
    {
      value: 'ediff',
      label: '几天后',
    },
  ],
}


export default {
  props: {
    parent: {
      type: Object,
    },
    data: {
      type: Object,
    },
    fieldList: {
      type: Array,
      default() {
        return []
      },
    },
    operatorList: {
      type: Array,
      default() {
        return []
      },
    },
  },
  name: "CreateRule",
  methods:{
    getRule(table, field) {
      let data = (rules && rules.string) || []
      let theField = this.getCurrentField(table, field)
      if (theField && theField.ControlType) {
        if (['Dropdown'].includes(theField.ControlType)) {
          return rules.dict
        } else if (['DateTime'].includes(theField.ControlType)) {
          return rules.date
        } else if (['Number', 'Decimal'].includes(theField.ControlType)) {
          return rules.number
        } else {
          return rules.string
        }
      }
      return data
    },
    // 添加规则
    addRule(data) {
      let rule = {
        type: 'Text',
        FilterTable: this.firstTable,
        FilterField: this.firstField,
        Operator: '==',
        FilterValue: '',
      }
      data.rules.push(rule)
    },
    // 删除规则
    delRule(index) {
      this.data.rules.splice(index, 1)
    },
    // 添加分组
    addGroup(data) {
      let group = {
        condition: 'OR',
        rules: [
          {
            type: 'Text',
            FilterTable: this.firstTable,
            FilterField: '',
            Operator: '',
            FilterValue: '',
          },
        ],
      }
      data.rules.push(group)
    },
    // 删除分组
    delGroup(data, parent) {
      let index = parent.rules.findIndex((item) => item === data)
      parent.rules.splice(index, 1)
    },



    // add
    getFieldList(filterTable) {
      return ['feild01']
    },
    // add
    getCurrentField(table, field) {
      return {"ControlType":"Dropdown"}
    },

  }
}
</script>

<style scoped>

</style>
